@for $i from 0 through 20 {
  .app-padding-#{$i} {
    padding: #{$i}px;
  }

  .app-padding-x-#{$i} {
    padding-left: #{$i}px !important;
    padding-right: #{$i}px !important;
  }

  .app-padding-y-#{$i} {
    padding-top: #{$i}px !important;
    padding-bottom: #{$i}px !important;
  }

  .app-padding-top-#{$i} {
    padding-top: #{$i}px !important;
  }

  .app-padding-left-#{$i} {
    padding-left: #{$i}px !important;
  }

  .app-padding-bottom-#{$i} {
    padding-bottom: #{$i}px !important;
  }

  .app-padding-right-#{$i} {
    padding-right: #{$i}px !important;
  }

  //负值
  .app-padding-m#{$i} {
    padding: -#{$i}px;
  }

  .app-padding-x-m#{$i} {
    padding-left: -#{$i}px !important;
    padding-right: -#{$i}px !important;
  }

  .app-padding-y-m#{$i} {
    padding-top: -#{$i}px !important;
    padding-bottom: -#{$i}px !important;
  }

  .app-padding-top-m#{$i} {
    padding-top: -#{$i}px !important;
  }

  .app-padding-left-m#{$i} {
    padding-left: -#{$i}px !important;
  }

  .app-padding-bottom-m#{$i} {
    padding-bottom: -#{$i}px !important;
  }

  .app-padding-right-m#{$i} {
    padding-right: -#{$i}px !important;
  }

}
